import type { App } from 'vue'

const mouseUp = new MouseEvent('mouseup', {
  view: window,
  bubbles: true,
  cancelable: true
})
const mouseDown = new MouseEvent('mousedown', {
  view: window,
  bubbles: true,
  cancelable: true
})
const onWheel = () => {
  document.body.dispatchEvent(mouseDown)
  document.body.dispatchEvent(mouseUp)
}
/**
 * @description 滚动时关闭页面所有popper
 * @param {App} app app实例
 */
export function closePopperDirective(app: App) {
  // 滚动时关闭页面所有popper（v-close-popper="[xxx,xxx]"）
  app.directive('close-popper', {
    mounted(element: HTMLDivElement) {
      element.addEventListener('wheel', onWheel)
    },
    beforeUnmount(element: HTMLDivElement) {
      element.removeEventListener('wheel', onWheel)
    }
  })
}
